<template>
  <div class="property-container">
    <div class="panel-left-container">
      <LeftPanel class="panel-item-container" />
    </div>

    <div class="panel-right-container">
      <RightPanel class="panel-item-container" />
    </div>
  </div>
</template>

<script>
import LeftPanel from "./components/LeftPanel/LeftPanel.vue";
import RightPanel from "./components/RightPanel/RightPanel.vue";

export default {
  name: "Item",
  components: {
    LeftPanel,
    RightPanel
  },
  data() {
    return {};
  },
  methods: {}
};
</script>

<style lang="less" scoped>
@import "../../assets/css/chuShiHua.less";

.property-container {
  .WH();
  display: flex;
  justify-content: space-between;

  .panel-left-container,
  .panel-right-container {
    .WH(24%, 95%);
    display: flex;
    flex-direction: column;
    justify-content: space-between;

    .panel-item-container {
      width: 100%;
      height: 100%;
    }
  }
}
</style>
